<script lang='ts' setup>
import { CloseWindowOption, MinimizeWindowOption, MaximizeWindowOption, AlwaysOnTopWindowOption } from './options'
withDefaults(defineProps<{
  closeable?: boolean,
  maximizeable?: boolean,
  minimizeable?: boolean,
  alwaysOnTopable?: boolean,
}>(), {
  closeable: false,
  maximizeable: false,
  minimizeable: false,
  alwaysOnTopable: false,
})

</script>

<template >
  <div class="window-options">
    <AlwaysOnTopWindowOption v-if="alwaysOnTopable" />
    <MinimizeWindowOption v-if="minimizeable"/>
    <MaximizeWindowOption v-if="maximizeable" />
    <CloseWindowOption v-if="closeable" />
  </div>
</template>

<style scoped lang='less'>
.window-options {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 100%;
  .window-option {
    color: var(--el-color-primary);
    &:hover {
      cursor: pointer;
    }
  }
}

</style>
